<template>
  <div>
    <a-row :gutter="10">
      <a-col :md="5" :sm="24">
        <a-card :bordered="false">
          <div style="background: #fff;padding-left:6px;height: 100%; margin-top: 5px">
            <a-tree
              showLine
              :selectedKeys="selectedKeys"
              :checkStrictly="true"
              @select="onSelect"
              :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
              :treeData="departTree"
              :autoExpandParent="autoExpandParent"
              :expandedKeys="iExpandedKeys"
              @expand="onExpand"
            />
          </div>
        </a-card>
      </a-col>
      <a-col :md="19" :sm="24">
        <a-card :bordered="false">
          <!-- 查询区域 11111-->
          <div class="table-page-search-wrapper">
            <a-form layout="inline" :label-col="labelCol" @keyup.enter.native="searchQuery">
              <a-row :gutter="24">

                <a-col :md="8" :sm="8">
                  <a-form-item label="标题">
                    <a-input placeholder="请输入项目名称" v-model="queryParam.project"></a-input>
                  </a-form-item>
                </a-col>

                <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
           <a-col :md="6" :sm="24">
               <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
               <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
           </a-col>
        </span>
              </a-row>
            </a-form>
          </div>

          <!-- 操作按钮区域 -->
          <div class="table-operator" :md="24" :sm="24">
            <a-button @click="handleAdd(3)" type="primary" icon="plus" style="margin-top: 16px">新增资讯内容</a-button>
          </div>

          <!-- table区域-begin -->
          <div>
            <a-table
              ref="table"
              size="middle"
              bordered
              rowKey="id"
              :columns="columns"
              :dataSource="dataSource"
              :pagination="ipagination"
              :loading="loading"
              :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
              @change="handleTableChange">

              <template slot="imgSlot" slot-scope="text">
                <span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
                <img v-else :src="getImgView(text)" height="30px" alt=""
                     style="max-width:80px;font-size: 12px;font-style: italic;" />
              </template>

              <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)" v-if="record.tenantId>0">编辑</a>
          <a-divider type="vertical" v-if="record.tenantId>0"/>
          <a-dropdown v-if="record.tenantId>0">
            <a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
                <a-menu slot="overlay">
                  <a-menu-item v-if="record.status=='0'&&record.tenantId>0">
                        <a-popconfirm title="确定发布吗?"
                                      @confirm='() => handlePost({id:record.id},"/h/cms/article/publish")'>
                          <a>发布</a>
                        </a-popconfirm>
                  </a-menu-item>
                  <a-menu-item v-if="record.status=='1'&&record.tenantId>0">
                        <a-popconfirm title="确定撤回发布吗?"
                                      @confirm='() => handlePost({id:record.id},"/h/cms/article/undo")'>
                          <a>撤回</a>
                        </a-popconfirm>
                  </a-menu-item>
                  <a-menu-item v-if="record.status=='0'&&record.tenantId>0">
                    <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                      <a>删除</a>
                    </a-popconfirm>
                  </a-menu-item>
                </a-menu>
          </a-dropdown>
        </span>

            </a-table>
          </div>
        </a-card>
      </a-col>
    </a-row>
    <h-cms-article-modal ref="modalForm" @ok="modalFormOk"></h-cms-article-modal>
    <h-cms-column-modal ref="modalFormCategory" @ok="modalFormOk"></h-cms-column-modal>
  </div>

</template>
<script>
import '@assets/less/TableExpand.less'
import HCmsArticleModal from './modules/HCmsArticleModal'
import HCmsColumnModal from './modules/HCmsColumnModal'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { putAction, getAction, postAction } from '@api/manage'
import { frozenBatch, queryMyNurseCategoryTreeList, searchByKeywords } from '@api/api'

export default {
  name: 'h_his_nurse_service_projectList',
  mixins: [JeecgListMixin],
  components: {
    HCmsArticleModal,
    HCmsColumnModal
  },
  data() {
    return {
      description: '资讯页面',
      labelCol: { style: { width: '80px' } },
      queryParam: {
        categoryType: '2'
      },
      // 表头
      columns: [
        {
          title: '资讯分类',
          align: 'center',
          dataIndex: 'columnName'
        },
        {
          title: '标题',
          align: 'center',
          dataIndex: 'title'
        },
        {
          title: '封面图',
          align: 'center',
          dataIndex: 'image',
          scopedSlots: { customRender: 'imgSlot' }
        },
        {
          title: '状态',
          align: 'center',
          dataIndex: 'status',
          customRender: (t, row, index) => {
            //0 待签到 1已签到 3请假
            return t == '0' ? '待发布' : '已发布'
          }
        },
        {
          title: '点击数',
          align: 'center',
          dataIndex: 'hits'
        },
        {
          title: '创建时间',
          align: 'center',
          dataIndex: 'createTime'
        },
        {
          title: '创建人',
          align: 'center',
          dataIndex: 'createUser'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          scopedSlots: { customRender: 'action' }
        }
      ],
      url: {
        list: '/h/cms/article/list',
        delete: '/h/cms/article',
        column: '/h/cms/column/queryTreeList'
      },
      iExpandedKeys: [],
      loading: false,
      autoExpandParent: true,
      disable: true,
      treeData: [],
      visible: false,
      departTree: [],
      hiding: true,
      model: {},
      depart: {},
      checkedKeys: [],
      selectedKeys: [],
      currentDeptId: 0
    }
  },
  computed: {},
  created() {
    this.refresh()
  },
  methods: {
    callback(key) {
      //console.log(key)
    },
    clearSelectedDepartKeys() {
      this.checkedKeys = []
      this.selectedKeys = []
      this.currentDeptId = ''
      this.$refs.DeptUserInfo.currentDeptId = ''
    },
    searchQuery() {
      this.queryParam.columnCode=this.currentDeptId;
      this.loadData(1);
      // 点击查询清空列表选中行
      // https://gitee.com/jeecg/jeecg-boot/issues/I4KTU1
      this.selectedRowKeys = []
      this.selectionRows = []
    },
    loadTree() {
      var that = this
      that.treeData = []
      that.departTree = []
      getAction(this.url.column, { categoryType: '2' }).then((res) => {
        if (res.success && res.result) {
          for (let i = 0; i < res.result.length; i++) {
            let temp = res.result[i]
            that.treeData.push(temp)
            that.departTree.push(temp)
            that.setThisExpandedKeys(temp)
            // console.log(temp.id)
          }
          this.loading = false
        }
        that.userIdentity = res.message
      })
    },
    setThisExpandedKeys(node) {
      //只展开一级目录
      if (node.children && node.children.length > 0) {
        this.iExpandedKeys.push(node.key)
      }
    },
    refresh() {
      this.loading = true
      this.loadTree()
    },

    onExpand(expandedKeys) {
      this.iExpandedKeys = expandedKeys
      this.autoExpandParent = false
    },
    onCheck(checkedKeys, e) {
      let record = e.node.dataRef
      // console.log('onCheck', checkedKeys, e);
      this.checkedKeys = []
      // if (e.checked === true) {
      this.currentDeptId = record.id
      this.checkedKeys.push(record.id)
      this.hiding = false
    },
    onSelect(selectedKeys, e) {
      if (this.selectedKeys[0] !== selectedKeys[0]) {
        this.selectedKeys = [selectedKeys[0]]
      }
      let record = e.node.dataRef
      this.checkedKeys.push(record.id)
      this.currentDeptId = record.id
    },
    handleAdd: function(btnType) {
      if (this.currentDeptId == '') {
        this.$message.warn('请选择左边的分类进行编辑')
        return
      }
      if (this.currentDeptId == 'key1' || this.currentDeptId == 'key2') {
        this.$message.warn('请选择左边的二级分类进行编辑')
        return
      }
      this.$refs.modalForm.add(this.currentDeptId)
      this.$refs.modalForm.title = '新增资讯内容'
      this.$refs.modalForm.disableSubmit = false
    },
    modalFormOk() {
      this.loadTree()
      // 新增/修改 成功时，重载列表
      this.loadData()
      //清空列表选中
      this.onClearSelected()
    }
  }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>